<template>
  <div class="uni-tabs-content-croll">
    <el-form :model="dataForm" v-loading="loading" :rules="dataRule" ref="dataForm" :label-width="$i18n.locale === 'en-US' ? '120px' : '120px'" class="uni-scroll">
      <el-divider content-position="left">密码策略</el-divider>
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="初始密码修改策略" prop="initPasswordModify">
            <el-radio v-model="dataForm.initPasswordModify" :label="0">关闭</el-radio>
            <el-radio v-model="dataForm.initPasswordModify" :label="1">提醒</el-radio>
            <el-radio v-model="dataForm.initPasswordModify" :label="2">强制</el-radio>
            <br />
            <span v-if="dataForm.initPasswordModify===0" class="form-item-explain">如果用户未修改初始密码，没有任何提示</span>
            <span v-if="dataForm.initPasswordModify===1" class="form-item-explain">如果用户未修改初始密码，登录后提醒修改</span>
            <span v-if="dataForm.initPasswordModify===2" class="form-item-explain">如果用户未修改初始密码，强制修改初始密码，若不修改则不能进行系统操作</span>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="密码安全复杂度" prop="passwordModifySecurityLevel">
            <el-radio v-model="dataForm.passwordModifySecurityLevel" :label="1">简单</el-radio>
            <el-radio v-model="dataForm.passwordModifySecurityLevel" :label="2">一般</el-radio>
            <el-radio v-model="dataForm.passwordModifySecurityLevel" :label="3">中等</el-radio>
            <el-radio v-model="dataForm.passwordModifySecurityLevel" :label="4">复杂</el-radio>
            <br />
            <span v-if="dataForm.passwordModifySecurityLevel===1" class="form-item-explain">密码要求有 数字、大写字母、小写字母 特殊字符 任选1种 的组合, 最少6位</span>
            <span v-if="dataForm.passwordModifySecurityLevel===2" class="form-item-explain">密码要求有 数字、大写字母、小写字母 特殊字符 任选1种 的组合, 最少8位</span>
            <span v-if="dataForm.passwordModifySecurityLevel===3" class="form-item-explain">密码要求有 数字、大写字母、小写字母 特殊字符 任选2-3种 的组合, 最少8位</span>
            <span v-if="dataForm.passwordModifySecurityLevel===4" class="form-item-explain">密码要求有 数字、大写字母、小写字母 特殊字符 任选4种 的组合, 最少8位</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="密码修改策略" prop="initPasswordModify">
            <el-radio v-model="dataForm.passwordModify" :label="0">关闭</el-radio>
            <el-radio v-model="dataForm.passwordModify" :label="1">提醒</el-radio>
            <el-radio v-model="dataForm.passwordModify" :label="2">强制</el-radio>
            <br />
            <span v-if="dataForm.passwordModify===0" class="form-item-explain">如果用户密码不满足密码安全规则，没有任何提示</span>
            <span v-if="dataForm.passwordModify===1" class="form-item-explain">如果用户密码不满足密码安全规则，登录后提醒修改</span>
            <span v-if="dataForm.passwordModify===2" class="form-item-explain">如果用户密码不满足密码安全规则，强制修改密码，若不修改则不能进行系统操作</span>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="dataForm.passwordModify!=0">
          <el-form-item label="密码修改策略周期" prop="passwordModifyCycle">
            <el-input v-model.number="dataForm.passwordModifyCycle">
              <template slot="append">天</template>
            </el-input>
            <br />
            <span class="form-item-explain">超过此时间登录系统时，则按照密码修改策略提醒或强制用户修改密码</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-divider content-position="left">登录策略</el-divider>
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="登录错误次数" prop="failureHere">
            <el-input v-model.number="dataForm.failureHere">
              <template slot="append">次</template>
            </el-input>
            <br />
            <span class="form-item-explain">登录时，密码错误超过次数后将锁定账号</span>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="解锁时间" prop="unlockTime">
            <el-input v-model.number="dataForm.unlockTime">
              <template slot="append">分钟</template>
            </el-input>
            <br />
            <span class="form-item-explain">账号锁定的时间</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="验证码显示次数" prop="verificationCodeHere">
            <el-input v-model.number="dataForm.verificationCodeHere">
              <template slot="append">次</template>
            </el-input>
            <br />
            <span class="form-item-explain">登录时，密码错误超过次数后将显示验证码，设置为0强制使用验证码登录</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="密码加密传输" prop="passwordEnc">
            <el-radio v-model="dataForm.passwordEnc" :label="false">关闭</el-radio>
            <el-radio v-model="dataForm.passwordEnc" :label="true">开启</el-radio>
            <br />
            <span class="form-item-explain">登录时，密码加密传输。开启后前台需同步设置</span>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="dataForm.passwordEnc">
          <el-form-item label="密码加密秘钥" prop="passwordEncKey">
            <el-input maxlength="16" v-model.number="dataForm.passwordEncKey">
            </el-input>
            <br />
            <span class="form-item-explain">登录密码加密秘钥，长度16位。开启后前台需同步设置</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :span="12">
        <el-col :span="12">
          <el-form-item prop="loginIpType" label="IP限制">
            <el-radio-group v-model="dataForm.loginIpType">
              <el-radio :label="3">关闭</el-radio>
              <el-radio :label="2">用户级别IP限制</el-radio>
              <el-radio :label="1">全局IP段限制</el-radio>
            </el-radio-group>
            <br />
            <span class="form-item-explain">开启后，用户登录时不符合IP设置将禁止登录</span>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="dataForm.loginIpType === 1">
          <el-form-item prop="loginIp" label="IP段">
            <el-input v-model="dataForm.loginIp"></el-input>
            <br />
            <span class="form-item-explain">格式：192.168.0.1/31,10.135.10.1/26</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-divider content-position="left">管理员模式</el-divider>
      <el-row :span="12">
        <el-col :span="12">
          <el-form-item label="系统管理员">
            <el-checkbox v-model="dataForm.sysAdminModel.optionVisit">功能访问权限</el-checkbox>
            <el-checkbox v-model="dataForm.sysAdminModel.optionData">数据访问权限</el-checkbox>
            <br />
            <el-checkbox v-model="dataForm.sysAdminModel.authVisit">功能管理权限</el-checkbox>
            <el-checkbox v-model="dataForm.sysAdminModel.authData">数据管理权限</el-checkbox>
            <br />
            <span class="form-item-explain">系统管理员所拥有的权限</span>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="二级管理员">
            <el-checkbox v-model="dataForm.comAdminModel.optionVisit">功能访问权限</el-checkbox>
            <el-checkbox v-model="dataForm.comAdminModel.optionData">数据访问权限</el-checkbox>
            <br />
            <el-checkbox v-model="dataForm.comAdminModel.authVisit">功能管理权限</el-checkbox>
            <el-checkbox v-model="dataForm.comAdminModel.authData">数据管理权限</el-checkbox>
            <br />
            <span class="form-item-explain">二级管理员所拥有的权限</span>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div class="uni-tab-form-bottom">
      <el-button size="small" type="primary" @click="dataFormSubmitHandle()">{{ $t('save') }}</el-button>
    </div>
  </div>
</template>

<script>
import debounce from 'lodash/debounce'
// import mainContent from '@/views/main-content'
// var content = mainContent
export default {
  data () {
    return {
      timestamp: this.$route.params.timestamp,
      loading: false,
      dataForm: {
        initPasswordModify: 0,
        passwordModifySecurityLevel: 1,
        passwordModify: 0,
        passwordModifyCycle: 0,
        failureHere: 0,
        unlockTime: 1,
        verificationCodeHere: 1,
        passwordEnc: false,
        passwordEncKey: '',
        loginIpType: 3,
        loginIp: '',
        sysAdminModel: {
          optionVisit: true,
          optionData: true,
          authVisit: true,
          authData: true
        },
        comAdminModel: {
          optionVisit: true,
          optionData: false,
          authVisit: false,
          authData: false
        }
      }
    }
  },
  computed: {
    dataRule () {
      return {
        initPasswordModify: [
          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
        ],
        passwordModifySecurityLevel: [
          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
        ],
        passwordModify: [
          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
        ],
        passwordModifyCycle: [
          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
        ],
        failureHere: [
          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
        ],
        unlockTime: [
          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
        ],
        verificationCodeHere: [
          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
        ],
        passwordEnc: [
          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
        ],
        passwordEncKey: [
          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
        ],
        loginIpType: [
          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
        ],
        loginIp: [
          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
        ]
      }
    }
  },
  created () {
    this.init()
  },
  methods: {
    init () {
      this.$nextTick(() => {
        this.$refs['dataForm'].resetFields()
        this.getInfo()
      })
    },
    // 获取信息
    getInfo () {
      this.loading = true
      this.$http.get(`/sys/appConfig/security`).then(({ data: res }) => {
        this.loading = false
        if (res.code !== 0) {
          return false
        }
        this.dataForm = {
          ...this.dataForm,
          ...res.data
        }
      }).catch(() => {
        this.loading = false
      })
    },
    // 表单提交
    dataFormSubmitHandle: debounce(function () {
      this.$refs['dataForm'].validate((valid) => {
        if (!valid) {
          return false
        }
        this.$http['post']('/sys/appConfig/security', this.dataForm).then(({ data: res }) => {
          if (res.code !== 0) {
            return false
          }
          this.$message({
            message: this.$t('prompt.success'),
            type: 'success',
            duration: 500,
            onClose: () => {
              // this.closeTab()
              // this.$emit('refreshDataList')
            }
          })
        }).catch(() => { })
      })
    }, 1000, { 'leading': true, 'trailing': false })
  }
}
</script>
<style scoped>
</style>
